$(function () {
  let layer = layui.layer;
  let form = layui.form;
  let clickUserId = '';
  // ***********************加载用户列表
  let data = {
    pagenum: 1,
    pagesize: 4
  }
  // 获取列表============================================================================================
  function getList() {
    $.ajax({
      url: '/admin/users',
      type: "get",
      // async: false,
      data,
      success: function (json) {
        let arr = json.data;
        console.log(json);
        let str = '';
        arr.forEach(e => {
          str += `<tr>
          <td>${e.id}</td>
          <td>${e.username}</td>
          <td>${e.nickname}</td>
          <td>${e.email}</td>
          <td >
            <button type="button" data-edit=${e.id} class="layui-btn layui-btn-xs userEdit">
              <a style="color: #fff" data-edit=cc target="iframeArea" href="./edit.html?${e.id}">编辑</a>
            </button>
            <button type="button" data-del=${e.id} class="layui-btn layui-btn-xs layui-btn-danger d-delet delete">删除</button>
            <button type="button" reset-pass=${e.id} class="layui-btn layui-btn-xs layui-btn-normal resetPass delete">重置密码</button>
          </td>
        </tr>`
        });
        $('tbody').html(str);
      },
    });
  }

  getList();


  // ************************删除用户

  $('tbody').on('click', '.d-delet', function () {
    let id = $('.d-delet').attr('data-del');
    console.log(id);
    $.ajax({
      url: `/admin/users/${id}`,
      type: 'DELETE',
      // data: id,
      success: function (res) {
        console.log(res);
        if (res.status == 0) {
          layer.msg(res.message)
          getList();
        }
      }
    })
  })


  // ***********************重置密码的form表单
  let str = `<form id="repwd-form" class="layui-form" style="margin: 15px 30px 0 0" lay-filter='resetForm'>
      <!-- 第一行：密码 -->
      <div class="layui-form-item">
        <label class="layui-form-label">密码</label>
        <div class="layui-input-block">
          <input type="text" name="password" required lay-verify="required" placeholder="请输入新密码" autocomplete="off" class="layui-input newPass">
        </div>
      </div>
      <!-- 第二行：确认密码 -->
      <div class="layui-form-item">
        <label class="layui-form-label">确认密码</label>
        <div class="layui-input-block">
          <input type="text" required lay-verify="required|same" placeholder="请重复输入新密码" autocomplete="off" class="layui-input">
        </div>
      </div>
      <!-- 第三行：按钮 -->
      <div class="layui-form-item">
        <div class="layui-input-block">
          <button class="layui-btn submit submitReset" lay-submit lay-filter="formDemo">提交</button>
          <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
      </div>
    </form>`;

  //表单验证=========================================================================
  form.verify({
    same: function (value, item) { //value：表单的值、item：表单的DOM对象
      //如果不想自动弹出默认提示框，可以直接返回 true，这时你可以通过其他任意方式提示（v2.5.7 新增）
      if (value !== $('.newPass').val()) {
        return '两次密码必须相同';
      }
    }
  });

  //重置密码点击事件====================================================================
  $('tbody').on('click', '.resetPass', function (e) {
    // e.stopPropagation();
    clickUserId = $(this).attr('reset-pass');
    console.log('点击了用户', clickUserId);

    layer.open({
      type: 1,
      content: str //这里content是一个普通的String
    });




  })
  //确认重置密码表单=====================================================================
  form.on('submit(resetForm)', function (e) {
    let id = clickUserId
    let date  = form.val('resetForm').password
    date = Number(date)
    console.log(id,date,typeof date);
    $.ajax({
      url: `/admin/users/${id}`,
      type: 'PUT',
      data: {password:'123'},
      success: function (res) {
        console.log(res, '重置完成');
        // if (res.status == 0) {
        //   layer.msg(res.message);
        // }
      }
    })
  })

  // $('.submitReset').on('click', function () {
  //   let date = form.val('resetForm');
  //   let id = clickUserId;
  //   $.ajax({
  //     url: 'admin/users/' + id,
  //     type: 'PUT',
  //     data: { password: date },
  //     success: function (res) {
  //       console.log(res)
  //     }
  //   })
  // })




})